<template>
  <div id="Dsh">
    <div class="print-div" id="print_area">
      <el-table
        ref="multipleTableRef"
        border
        style="width: 100%; cursor: pointer"
        :data="useTable.tableList"
        @selection-change="handleSelectionChange"
        :cell-class-name="getCellIndex"
        @row-click="RowListData"
      >
        <el-table-column type="selection" width="55" />
        <el-table-column label="序号" fixed="left" width="60" type="index" />
        <!-- 循环表头的数据 -->
        <template v-for="item in useTable.tableHeader" :key="item.property">
          <el-table-column
            :property="item.property"
            :label="item.lable"
            v-if="item.isShow"
            show-overflow-tooltip
            v-slot="scope"
          >
            <template v-if="item.property === 'unit'">
              <slot name="danWei" :row="scope.row"></slot>
              <component :is="item.render" :row="scope.row" v-if="item.render"> </component>
            </template>
          </el-table-column>
        </template>
        <el-table-column fixed="right" label="操作" width="120">
          <template #default="scope">
            <el-button link type="primary" size="small">复制</el-button>
            <el-button link type="primary" size="small" @click.stop="removeItemTable(scope.row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script lang="ts" setup name="Dsh">
// Dsh数据仓库中使用
import useStore from '@/stores'
import { useDark } from '@/hooks/useCommon'
const { useTable } = useStore()
const { col, getCellIndex } = useDark()
// 点击每一行显示弹窗但是把操作和多选和序号排除以外
const RowListData = async (row: any, column: any, event: any) => {
  col(column, aaa)
}
const aaa = () => {
  alert('11')
}

const handleSelectionChange = (val: any) => {
  useTable.printingList = val
}

const removeItemTable = (row: any) => {
  console.log('🌈成功->信息')
}
</script>

<style lang="scss" scoped>
#Dsh {
  margin: 10px 0;
  .rowTable {
    cursor: pointer;
  }
}
</style>
